/**
 * Created by Tsuna Chenug on 2016/12/7.
 */
import React, { Component } from 'react';
import {
    AppRegistry,
    StyleSheet,
    Text,
    View,
    Image,
    TextInput,
    Navigator,
    TouchableOpacity,
    TabBarIOS,
} from 'react-native';

import Homepage_Tab from './Homepage_Tab'
import Discover_Tab from './Discover_Tab';
import Me_Tab from './Me_Tab';
import Record_Tab from './Record_Tab'
import Evaluate from './Evaluate'
import Resume from './Resume'
import AE from './AnnualEvaluation'
import BasicInformation from './BasicInformation'

//var base64Icon = '';
export default class indexTabBar extends Component {
    constructor(props){
        super(props);
        this.state={
            selectedTab: '../Images/home_selected.png',
            tab:"Home",
            notifCount: 0,
            presses: 0,
        };
    }
    // getInitialState() {
    //   return {
    //     message:"",
    //     selectedTab: './images/home_selected.png'
    //   };
    // }
    componentDidMount(){
        this.setState({
            message:this.props.message,
        })
    }

    changeTab(tabName) {
        this.setState({
            selectedTab: tabName
        });
    }
    _gotoEvaluate = () => {
        const {navigator}=this.props;
        if (navigator) {
            navigator.push({
                name: 'Evaluate',
                component: Evaluate,
            })
        }
    }
    _gotoWeekStar = () => {
        const {navigator}=this.props;
        if (navigator) {
            navigator.push({
                name: 'WeekStar',
                component: WeekStar,
            })
        }
    }
    _gotoBasicInformation = () => {
        const {navigator}=this.props;
        if (navigator) {
            navigator.push({
                name: 'BasicInformation',
                component: BasicInformation,
            })
        }
    }
    _gotoResume = () => {
        const {navigator}=this.props;
        if (navigator) {
            navigator.push({
                name: 'Resume',
                component: Resume,
            })
        }
    }
    _gotoAE = () => {
        const {navigator}=this.props;
        if (navigator) {
            navigator.push({
                name: 'AnnualEvaluation',
                component: AE,
            })
        }
    }
    render() {
        return (
            <TabBarIOS>
                <TabBarIOS.Item
                    title="Home"
                    icon={ require('../Images/home_normal.png') }
                    onPress={ () => this.changeTab('../Images/home_selected.png') }
                    selected={ this.state.selectedTab === '../Images/home_selected.png' }>
                    <Homepage_Tab/>
                </TabBarIOS.Item>
                <TabBarIOS.Item
                    title="Discover"
                    icon={ require('../Images/discover_normal.png') }
                    onPress={ () => this.changeTab('../Images/discover_selected.png') }
                    selected={ this.state.selectedTab === '../Images/discover_selected.png' }>
                    <Discover_Tab function={this._gotoEvaluate}/>
                </TabBarIOS.Item>
                <TabBarIOS.Item
                    title="Record"
                    icon={ require('../Images/record_normal.png') }
                    onPress={ () => this.changeTab('../Images/record_selected.png') }
                    selected={ this.state.selectedTab === '../Images/record_selected.png' }>
                    <Record_Tab/>
                </TabBarIOS.Item>
                <TabBarIOS.Item
                    title="Me"
                    icon={ require('../Images/me_normal.png') }
                    onPress={ () => this.changeTab('../Images/me_selected.png') }
                    selected={ this.state.selectedTab === '../Images/me_selected.png' }>
                    <Me_Tab gotoResume={this._gotoResume}
                            gotoAE={this._gotoAE}
                            gotoBasic={this._gotoBasicInformation}
                          />
                </TabBarIOS.Item>
            </TabBarIOS>
        );
    }
}

var styles = StyleSheet.create({
    pageView: {
        backgroundColor: '#fff',
        flex: 1,
        alignSelf:"center",
    },

});
